<template>
  <el-dialog
    title="批量启用/禁用[跨境兴运]授权"
    width="680"
    :modelValue="modelValue"
    @close="handleClose"
    draggable
    align-center
  >
    <div class="h-[120px] flex justify-center items-center">
      <div>
        <div>
          已选中:
          <div class="ml-[2px] mr-[6px] text-[#da0014]">{{
            ids?.length || 0
          }}</div
          >条
        </div>
        <div class="my-[16px]">
          <el-form-item label="[跨境兴运]授权">
            <el-radio-group v-model="status">
              <el-radio label="enable">启用</el-radio>
              <el-radio label="disable">禁用</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>

        <div>
          <div class="text-[#da0014]"
            >说明:新用户启用跨境兴运授权时,会自动创建跨境兴运的账号,需去跨境兴运后台配置权限!</div>
        </div>
      </div>
    </div>
    <template #footer>
      <div class="dialog-button">
        <el-button :disabled="loading" @click="handleClose(false)">
          {{ disabled ? "关闭" : "取消" }}
        </el-button>
        <el-button
          v-if="!disabled"
          type="primary"
          :loading="loading"
          @click="handleSave"
        >
          确认
        </el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="jsx">
import { ElMessage } from "element-plus";
import api from "../../api";
const props = defineProps({
  disabled: { type: Boolean, default: false },
  ids: { type: Array, default: () => [] },
  modelValue: { type: Boolean, default: false },
});
const loading = ref(false);
const { ids } = toRefs(props);
const emit = defineEmits(["update:modelValue", "refresh", "close"]);
const status = ref(null);
const handleSave = async () => {
  try {
    loading.value = true;
    let { code, message } = await api.batchOauth({
      tu_ids: ids.value,
      do: status.value,
    });
    if (code !== 200) {
      ElMessage.warning(message);
      return;
    }
    ElMessage.success("推送成功");
    handleClose(true);
  } catch (error) {
  } finally {
    loading.value = false;
  }
};

const handleClose = async (refresh) => {
  ids.value = [];
  status.value = null
  emit("update:modelValue", false);
  emit("close");
  if (refresh) emit("refresh");
};
</script>
